import presetWeapp from "unocss-preset-weapp";
import {
  extractorAttributify,
  transformerClass,
} from "unocss-preset-weapp/transformer";
import {
  defineConfig,
  Preset,
  presetIcons,
  SourceCodeTransformer,
} from "unocss";

const { presetWeappAttributify, transformerAttributify } =
  extractorAttributify();

const transformRules = {
  ".": "-d111-",
  "/": "-s111-",
  ":": "-c111-",
  "%": "-p111-",
  "!": "-e111-",
  "#": "-w111-",
  "(": "-b111l-",
  ")": "-b111r-",
  "[": "-f111l-",
  "]": "-f111r-",
  $: "-r111-",
  ",": "-r222-",
};

const prefix = `uno-`;

export default defineConfig({
  rules: [
    // ['m-1', { margin: '0.25rem' }],  //=>  .m-1 { margin: 0.25rem; }
    [
      /^uno-fs-(\d+)$/,
      ([, d]) => ({ "font-size": `${d}px`, "line-height": 1.5 }),
    ],
  ],
  presets: [
    // https://github.com/MellowCo/unocss-preset-weapp
    presetWeapp({
      isH5: process.env.TARO_ENV === "h5",
      platform: "taro",
      taroWebpack: "webpack5",
      whRpx: true, //宽高默认单位是否为 rpx
      prefix,
      nonValuedAttribute: true,
      transform: true,
      transformRules,
    }) as Preset<object>,
    presetWeappAttributify() as Preset<object>,
    presetIcons({
      scale: 1.2,
      warn: true,
    }),
  ],
  shortcuts: [
    // {
    //   "border-base": "border border-gray-500/10",
    //   center: "flex justify-center items-center",
    // },
  ],

  transformers: [
    // https://github.com/MellowCo/unocss-preset-weapp/tree/main/src/transformer/transformerAttributify
    // https://github.com/MellowCo/unocss-preset-weapp/tree/main/src/transformer/transformerAttributify
    // @ts-ignore
    transformerAttributify({
      classPrefix: prefix,
      nonValuedAttribute: true,
      transformRules,
    }) as unknown as SourceCodeTransformer,

    // https://github.com/MellowCo/unocss-preset-weapp/tree/main/src/transformer/transformerClass
    transformerClass({
      transformRules,
    }) as unknown as SourceCodeTransformer,
  ],
});
